/* 
1 点击a标签来切换显示登录和注册盒子
  1 给登录盒子中a标签绑定点击事件   隐藏登录盒子 - 显示注册盒子
  2 给注册盒子中a标签绑定点击事件   隐藏注册盒子 - 显示登录盒子 

  2 注册
    1 给注册表单 绑定提交事件 - 阻止默认行为
    2 获取注册表单中的 用户名和密码
    3 调用 注册接口...
    4 成功 恭喜 用户，自动切换到登录界面

    3 登录
        1 给登录表单 绑定提交事件 - 阻止默认行为
        2 获取用户名和密码 发送给后端 响应token 回来
        3 前端 接收token 使用本地存储 存起来
        4 跳转页面 首页

    4 首页
        1 发送请求 获取token 携带参数 发送出去
            有token 后端响应 正确数据
            没有token 后端响应 你没有权限 code = 2 前端接收到后端响应 判断 如果没有权限 - 跳转回登录页面！！
 */

// 获取登录和注册盒子
const registerBox = document.querySelector('.register');  // 注册盒子
const loginBox = document.querySelector('.login');  //  登录盒子
const registerA = document.querySelector('.register-a');  //
const loginA = document.querySelector('.login-a');  // 


// 给登录盒子中a标签绑定点击事件
loginA.addEventListener('click',function(){
    // 隐藏登录盒子 - 显示注册盒子
    loginBox.style.display = 'none';
    registerBox.style.display = 'block';
});

// 给注册盒子中a标签绑定点击事件
registerA.addEventListener('click',function(){
    // 隐藏注册盒子 - 显示登录盒子
    registerBox.style,display = 'none';
    loginBox.style.display = 'block';
})

// 给注册表单绑定 提交事件
registerBox.querySelector('form').addEventListener('submit',function(e){
    e.preventDefault();  // 阻止表单默认行为
    // console.log(123);
    // console.log(this);  // form
    // 获取注册表单中的用户名和密码 jq的快速获取的方式
    const data = $(this).serialize();

    axios.post('/api/register',data).then((result) => {
        console.log(result);
        if(result.data.code === 0) {
            toastr.success(result.data.message);
            // 模拟 用户点击  注册盒子中的a标签即可
            registerA.click();
        }else {
            console.log('有问题');
            console.log(result);
        }
    })
})

// 给登录表单绑定 登录事件
loginBox.querySelector('form').addEventListener('submit',function(e){
    e.preventDefault();
    // 获取表单中的用户名和密码 jq的快速获取的发送
    const data = $(this).serialize();

    // 调起登录接口
    axios.post('/api/login',data).then((result) => {
        console.log(result);
        if(result.data.code === 0) {
            // 存token
            localStorage.setItem('token82',result.data.token);
            // 弹出一个提示框 显示一会之后 再跳
            toastr.success(result.data.message);
            setTimeout(() => {
                // 跳转页面
                location.href = "./index.html";
            }, 1500)
        }
    })
})